#@layout()

#define script()
<script>
    function del(id) {
        if (confirm('确定要删除该菜单吗？删除后不可恢复')) {
            ajaxGet("#(CPATH)/admin/template/doMenuDel/" + id);
        }
    }
</script>
#end

#define content()
    <section class="content-header">

        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-6">

                    <div class="row mb-2">
                        <div class="col-sm-12">
                            <h1>
                                菜单管理
                                <small data-toggle="tooltip" title="" data-placement="right"
                                       data-trigger="hover"><i class="nav-icon far fa-question-circle"></i></small>
                                <small> 首页 / 模板 / 菜单管理</small>
                            </h1>
                        </div>
                    </div>
                </div>
            </div>

        </div><!-- /.container-fluid -->
    </section>

    <section class="content">

        <div class="row">
            <div class="col-lg-5">
                <div class="card card-outline card-primary">

                    <!-- /.card-header -->
                    <!-- form start -->
                    <form class=" form-setting autoAjaxSubmit" autocomplete="off"
                          action="#(CPATH)/admin/template/doMenuSave"
                          data-ok-href="#(CPATH)/admin/template/menu"
                          method="post" >

                        <input type="hidden" name="menu.id" value="#(menu.id ??)">
                        <input type="hidden" name="menu.type" value="main">
                        <div class="card-body">
                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label"><span class="text-danger mr-2">*</span> 名称</label>

                                <div class="col-sm-9">
                                    <input type="input" class="form-control" placeholder="请输入菜单名称" required
                                           value="#(menu.text ??)" name="menu.text">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label"><span class="text-danger mr-2">*</span> URL</label>

                                <div class="col-sm-9">
                                    <input type="input" class="form-control" placeholder="以及菜单对应的连接地址..." required
                                           value="#(menu.url ??)" name="menu.url">
<!--                                    <p class="text-muted">首页链接为：/ ，文章列表页：/articles，产品列表页：/products </p>-->
                                </div>

                            </div>


                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">父级</label>

                                <div class="col-sm-9">
                                    <select class="form-control" name="menu.pid">
                                        #if(menu && menu.pid == 0)
                                        <option value="0" selected>顶级</option>
                                        #else
                                        <option value="0">顶级</option>
                                        #end

                                        #for(m : menus)
                                        #if(menu && menu.pid == m.id)
                                        <option value="#(m.id)" selected>#(m.layerString) #(m.text)</option>
                                        #elseif(menu && (menu.id == m.id || menu.isMyChild(m.id)))
                                        <option value="#(m.id)" disabled>#(m.layerString) #(m.text)</option>
                                        #else
                                        <option value="#(m.id)">#(m.layerString) #(m.text)</option>
                                        #end
                                        #end
                                    </select>
                                </div>
                            </div>


                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">排序</label>
                                <div class="col-sm-9">
                                    <input type="input" class="form-control" placeholder="此菜单排序的序号"
                                           name="menu.order_number"
                                           value="#(menu.order_number ??)">
                                    <p class="text-muted"> 越小的数字越靠前，只在同级分类上影响。 </p>
                                </div>
                            </div>


                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">图标</label>
                                <div class="col-sm-9">
                                    <input type="input" class="form-control" placeholder="菜单的图标"
                                           value="#escape(menu.icon ??)" name="menu.icon">
                                    <p class="text-muted">
                                        图标只用于前台显示，是否显示决定于模板。
                                    </p>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">目标</label>

                                <div class="col-sm-9">
                                    <select class="form-control" name="menu.target">
                                        #if(menu)
                                        <option value="_self" #selectedIf(menu.target==
                                        '_self')>当前页</option>
                                        <option value="_blank" #selectedIf(menu.target==
                                        '_blank')>新窗口</option>
                                        #else
                                        <option value="_self" selected>当前页</option>
                                        <option value="_blank">新窗口</option>
                                        #end
                                    </select>
                                </div>
                            </div>


                        </div>
                        <!-- /.card-body -->
                        <div class="card-footer">
                            <div class="offset-sm-2 col-sm-10 submit-block">
                                <div class="card-submit">
                                    <button type="submit" class="btn btn-primary">提交</button>
                                </div>
                            </div>
                        </div>
                        <!-- /.card-footer -->
                    </form>
                </div>
            </div>
            <div class="col-lg-7">
                <div class="card card-outline card-primary">



                    <div class="card-body p-0  ">

                        <table class="table table-striped">
                            <tbody>
                            <tr>
                                <th style="width: 50%">文本</th>
                                <th>URL</th>
                                <th>排序</th>
                            </tr>
                            #for(menu : menus)
                            <tr>
                                <td>
                                    <strong>
                                        <a href="#(menu.url ??)" target="_blank">
                                            #(menu.layerString) #(menu.text ??)
                                        </a>
                                    </strong>
                                    <div class="jp-action-card">
                                        <div class="jp-action-body">
                                            <a href="#(CPATH)/admin/template/menu/#(menu.id)"
                                               style="color: #006505">编辑</a> |
                                            <a href="javascript:;" onclick="del('#(menu.id??)')"
                                               style="color: #a00">删除</a> |
                                            <a href="#(menu.url ??)" target="_blank" style="color: #a00">查看</a>
                                        </div>
                                    </div>
                                </td>
                                <td>#(menu.url ??)</td>
                                <td>#(menu.order_number ??)</td>
                            </tr>
                            #else
                            <tr class="nodata"><td colspan="999">暂无数据</td> </tr>
                            #end
                            </tbody>
                        </table>
                    </div>
                    <!-- /.card-body -->
                    <div class="card-footer">
                        <div class="row">
                            <div class="col-sm-12">
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.card -->
            </div>
            </div>
    </section>
#end
